<div class="sc_form_body">
    <form action="{$view['id']?U('save'):U('add')}?spm={$spm}" id="form" class="layui-form layui-form-pane">
        <input type="hidden" name="id" value="{$view.id|default=''}" />
        <div class="layui-box layui-tab">
            <ul class="layui-tab-title">
                <li class="layui-this">常规</li>
                <li>高级</li>
                <li>SEO</li>
            </ul>
            <div class="layui-tab-content">
                <!-- tab1 -->
                <div class="layui-tab-item layui-show">
                    <div class="layui-form-item">
                        <label class="layui-form-label">上级栏目</label>
                        <div class="layui-input-block">
                            <select name="pid" lay-filter="getPath">
                                <option value="0" path="" tid="1">顶级栏目</option>
                                {volist name="list" id="data"}
                                    <option value="{$data.id}" path="{$data.path}" tid="{$data.tid}" {$view['pid']==$data['id']?'selected':''} {eq name="view.id" value="$data.id"}disabled{/eq}>{$data.delimiter}{$data['pid']?'├':''} {$data.title}</option>
                                {/volist}
                            </select>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-row layui-col-space15">
                            <div class="layui-col-md6">
                                <label class="layui-form-label label-required">名称</label>
                                <div class="layui-input-block">
                                    <input type="text" name="title" value="{$view.title|default=''}" placeholder="栏目名称" datatype="*" nullmsg="请输入名称!" autocomplete="off" class="layui-input" />
                                </div>
                            </div>
                            <div class="layui-col-md6">
                                <label class="layui-form-label">英文名称</label>
                                <div class="layui-input-block">
                                    <input type="text" name="title_en" value="{$view.title_en|default=''}" placeholder="英文名称" autocomplete="off" class="layui-input" />
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label label-required">访问路径</label>
                        <div class="layui-input-block">
                            <div class="layui-form-mid layui-word-aux path"></div>
                            <input type="text" name="flag" value="{$view.flag|default=''}" placeholder="使用3-16英文或拼音" datatype="*" nullmsg="请输入访问路径!" errormsg="路径名称-请使用3-16位英文或拼音!" class="layui-input layui-input-inline" />
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">栏目模型</label>
                        <div class="layui-input-block type_radio">
                            <input type="radio" name="tid" value="0" title="首页" class="type_radio" {$view['tid']=='0'?'checked':''} />
                            {volist name="type" id="data"}
                                <input type="radio" name="tid" value="{$data.id}" title="{$data.title}" class="type_radio" {eq name="view.tid|default='1'" value="$data.id"}checked{/eq} />
                            {/volist}
                        </div>
                    </div>
                </div>
                <!-- tab2 -->
                <div class="layui-tab-item">
                    <div class="layui-form-item">
                        <div class="layui-row layui-col-space15">
                            <div class="layui-col-md6">
                                <div class="layui-form-item">
                                    <label class="layui-form-label">别名</label>
                                    <div class="layui-input-block">
                                        <input type="text" name="subtitle" value="{$view.subtitle|default=''}" placeholder="别名" class="layui-input" />
                                    </div>
                                </div>
                                <div class="layui-form-item">
                                    <label class="layui-form-label">排序号</label>
                                    <div class="layui-input-block">
                                        <input type="text" name="order_id" value="{$view.order_id|default=''}" placeholder="排序号 - 数字越大越前，默认或不填为0" class="layui-input" />
                                    </div>
                                </div>
                                <div class="layui-form-item" pane="">
                                    <label class="layui-form-label">属性</label>
                                    <div class="layui-input-block">
                                        <input type="checkbox" name="is_show" value="1" title="显示" lay-skin="primary" {eq name="$view.is_show|default=1" value="1"}checked{/eq} />
                                        <input type="checkbox" name="is_url" value="1" title="外链" lay-skin="primary" lay-filter="url" {eq name="$view.is_url|default=0" value="1"}checked{/eq} />
                                    </div>
                                </div>
                                <div class="layui-form-item url">
                                    <label class="layui-form-label">外链地址</label>
                                    <div class="layui-input-block">
                                        <input type="text" name="url" value="{$view.url|default=''}" placeholder="外链地址" class="layui-input" />
                                    </div>
                                </div>
                            </div>
                            <div class="layui-col-md6">
                                <div class="layui-form-item from_item_image">
                                    <div class="img_label">
                                        <label>封面图</label>
                                        <a id="btn_upload_thumb"></a>
                                        <span><i class="layui-icon" data-tips-text="推荐尺寸 720x720">&#xe6b2;</i></span>
                                    </div>
                                    <div id="thumb_view" class="img_item transition" style="background-image:url('{$view.thumb|default='__Base__/images/noimg.png'}')">
                                        <img layer-src="{$view.thumb|default='__Base__/images/noimg.png'}" src="__Base__/images/alpha.png">
                                        <input type="hidden" name="thumb" value="{$view.thumb|default=''}">
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- tab3 -->
                <div class="layui-tab-item">
                    <div class="layui-form-item">
                        <label class="layui-form-label">关键词</label>
                        <div class="layui-input-block">
                            <input type="text" name="keywords" value="{$view.keywords|default=''}" placeholder="关键词" class="layui-input" />
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">描述</label>
                        <div class="layui-input-block">
                            <textarea name="description" placeholder="描述" class="layui-textarea">{$view.description|default=''}</textarea>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn">保存</button>
            </div>
        </div>
    </form>
</div>
<script>
    //缩略图
    $('body').on('change', '.img_item input', function() {
        var imgInput = $('form').find('[name=' + $(this).attr("name") + ']');
        imgInput.parent('.img_item').css('background-image', 'url(' + this.value + ')');
        imgInput.parent().find('img').attr('layer-src', this.value);
    });
    $(document).ready(function() {
        //图片预览
        layer.photos({photos: '#thumb_view',shade: 0.7,anim: 5});
        $(".path").text($("select[name='pid'] option:selected").attr('path')+'/');
        layui.form.on('select(getPath)', function(data){
            $(".path").text($("select[name='pid']").children("option[value='"+data.value+"']").attr('path')+'/');
            var tid = $("select[name='pid'] option:selected").attr('tid');
            $(".type_radio input:radio[value='" + tid + "']").next().find("i").click();
        });
        {eq name='$view.is_url|default=0' value='0'}
            $(".url").hide();
        {/eq}
        layui.form.on('checkbox(url)', function(data){
            data.elem.checked ? $(".url").show(500) : $(".url").hide(500);
        });
    });
    $('#btn_upload_thumb').uploadify({
        'swf'      : '/Public/plugs/uploadify/uploadify.swf',
        'uploader' : '{:U("Uploads/upload")}',
        'multi' : false,
        'buttonClass' : '',
        'buttonText' : '本地上传',
        'width' : 110,
        'height' : 36,
        'onUploadSuccess' : function(file, data, response) {
            var allData = eval('(' + data + ')');
            if(allData.status == 1){
                $("#thumb_view").css("background-image","url("+allData.image_src+")");
                $("#thumb_view").find('img').attr('layer-src', allData.image_src);
                $("#thumb_view").find('input').val(allData.image_src);
            }else{
                var timer;
                layer.open({
                    content: allData.info,
                    closeBtn: 0,
                    icon: 2,
                    btn:[],
                    success: function(a,b){
                        var i = 1;
                        var fn = function() {
                            layer.title(i + ' 秒后自动关闭。',b);
                            if(!i) {layer.close(b); return false;} i--;
                        };
                        timer = setInterval(fn, 1000);
                        fn();
                    },
                    cancel: function(i){
                        return false;
                    },
                    end: function(){clearInterval(timer);}
                });
            }
        },
    });
</script>
